<template>
  <div class="home-body flex-row">
    <div class="nav-menu">
      <div class="menu-head">
        <span>
          <svg-icon class-name="icon-size" icon-class="home-menu-tip"></svg-icon>
        </span>
        <span style="margin-left:10px;">员工在线平台</span>
      </div>
      <div class="under-line"></div>
      <el-menu
        default-active="1"
        class="el-menu-vertical-demo"
        @select="activeSelected"
        background-color="#314A63"
        text-color="#999999"
        active-text-color="#ffffff"
      >
        <el-menu-item index="1">
          <i class="el-icon- iconfont icontianchongxing-"></i>
          <!-- <svg-icon icon-class='home-menu-tip'> -->
          <span slot="title">首页</span>
        </el-menu-item>
        <el-menu-item v-show="menuList.includes('system')" index="2">
          <i class="el-icon-setting"></i>
          <span slot="title">系统管理</span>
        </el-menu-item>
        <el-menu-item v-show="menuList.includes('people')" index="3">
          <i class="el-icon- iconfont iconweibiaoti--"></i>
          <span slot="title">人才引荐管理</span>
        </el-menu-item>
        <el-menu-item v-show="menuList.includes('growup')" index="4">
          <i style="font-size:16px;" class="el-icon- iconfont iconxinfeng2"></i>
          <span slot="title">成长档案管理</span>
        </el-menu-item>
        <el-menu-item v-show="menuList.includes('study')" index="5">
          <i class="el-icon- iconfont iconwenti-shuben"></i>
          <span slot="title">学习中心管理</span>
        </el-menu-item>
        <el-menu-item v-show="menuList.includes('work')" index="6">
          <i style="font-size:16px;" class="el-icon- iconfont iconrili"></i>
          <span slot="title">办事指南管理</span>
        </el-menu-item>
        <el-menu-item v-show="menuList.includes('human')" index="7">
          <i style="font-size:21px;font-weight:bold;" class="el-icon- iconfont iconxingming"></i>
          <span slot="title">人事制度管理</span>
        </el-menu-item>
        <el-menu-item v-show="menuList.includes('goBuy')" index="8">
          <i style="font-size:16px;font-weight:bold;" class="el-icon- iconfont iconicon-test"></i>
          <span slot="title">外购外派管理</span>
        </el-menu-item>
      </el-menu>
      <div
        v-show="initBtnShow"
        v-loading.fullscreen.lock="fullscreenLoading"
        @click="initData"
        class="init-data-btn"
      >
        <span style="font-size:27px;" class="iconfont iconshuaxin"></span>
      </div>
    </div>
    <div :style="topClear" class="section-right">
      <AritvalBar :navbarType="navbarType"></AritvalBar>
      <div :is="componentName"></div>
    </div>
    
  </div>
</template>
<style lang="less" scoped>
@import url("~@/pagecss/home.less");
.init-data-btn {
  position: absolute;
  bottom: 37px;
  left: 82px;
  cursor: pointer;
}
.init-data-btns {
  position: absolute;
  bottom: 30px;
  left: 117px;
  cursor: pointer;
}
.el-radio {
  margin-bottom: 20px;
}
</style>
<script>
import { Message } from "element-ui";
import AritvalBar from "@/components/aritcalBar";
import growthArchives from "@/pages/growthArchives/growthArchives";
import home from "@/pages/home/home";
import personnelSystem from "@/pages/personnelSystem/personnelSystem";
import recommendation from "@/pages/recommendation/recommendation";
import studyCenter from "@/pages/studyCenter/studyCenter";
import systemControl from "@/pages/systemControl/system";
import thingsTip from "@/pages/thingsTip/thingsTip";
import outpack from "@/pages/outpack/thingsTip";
export default {
  components: {
    AritvalBar,
    home,
    growthArchives,
    personnelSystem,
    recommendation,
    studyCenter,
    systemControl,
    thingsTip,
    outpack
  },
  data() {
    return {
      disAgree: false,
      agree: false,
      smallLoading: false, // 默认文件上传过度
      fileListMenus: [], // 默认文件
      classRadio: "1",
      fullscreenLoading: false,
      topClear: "padding-top:0;",
      componentName: "home",
      checkApply: false,
      menuRout: [
        "home",
        "systemControl",
        "recommendation",
        "growthArchives",
        "studyCenter",
        "thingsTip",
        "personnelSystem",
        'outpack'
      ],
      navbarType: "home",
      menuList: [],
      initBtnShow: false
    };
  },
  mounted() {
    let menuList = localStorage.getItem("menuList");
    let initMenuList = JSON.parse(menuList);
    let that = this;
    this.menuList = initMenuList.permissions.menus;
    initMenuList.role.map(item => {
      if (item.id == 1) {
        that.initBtnShow = true;
      }
    });
  },
  watch: {
    classRadio() {
      this.fileListMenus = [];
    }
  },
  methods: {
    activeSelected(key, keyPath) {
      // let {menuRout,componentName} = this;
      this.componentName = this.menuRout[key - 1];
      this.navbarType = this.menuRout[key - 1];
    },
    initData() {
      this.fullscreenLoading = true;
      this.$get("sync_dd_user").then(res => {
        if (res.success) {
          Message({
            message: "初始化成功",
            type: "success",
            duration: 2000
          });
          this.fullscreenLoading = false;
        } else {
          Message({
            message: "初始化失败",
            type: "success",
            duration: 2000
          });
          this.fullscreenLoading = false;
        }
      });
    },
    
    diloagClose() {
      this.fileListMenus = [];
    },
    limitNums() {
      Message({
        message: "只能上传一个文件",
        type: "warning",
        duration: 2000
      });
    },
    // 视频文件删除
    limitRemoves(flie) {
      this.fileListMenus = [];
    },
    // 微课程文件
    addAttachments(file, fileList) {
      let { classRadio } = this;
      this.fileListMenus = fileList;
      let formdata = new FormData();
      if(classRadio == 7 || classRadio == 8){
        formdata.append("multipartFile", file.raw);
      }else{
        formdata.append("file", file.raw);
      }
      let config = {
        header: {
          "Content-Type": "mutipart/form-data"
        }
      };
      if (classRadio == 1) {
        this.flieUpload('/excel/rank/import',formdata,config);
      }else if(classRadio == 2){
        this.flieUpload('/excel/per/import',formdata,config);
      }else if(classRadio == 3){
        this.flieUpload('/excel/title/import',formdata,config);
      }else if(classRadio == 4){
        this.flieUpload('/excel/project/import',formdata,config);
      }else if(classRadio == 5){
        this.flieUpload('/excel/patent/import',formdata,config);
      }else if(classRadio == 6){
        this.flieUpload('/excel/six/import',formdata,config);
      }else if(classRadio == 7){
        this.flieUpload('/coursePC/importCourse',formdata,config);
      }else if(classRadio == 8){
        this.flieUpload('/teaPC/importTea',formdata,config);
      }
      console.log(classRadio);
    },
    flieUpload(url, formdata,config) {
      this.smallLoading = true;
      this.disAgree = true;
      this.agree = true;
      this.$http
        .post(url, formdata, config)
        .then(res => {
          if (res.data.success) {
            Message({
              message: "操作成功",
              type: "success",
              duration: 2000
            });
            this.checkApply = false;
            this.smallLoading = false;
            this.disAgree = false;
            this.agree = false;
          } else {
            this.smallLoading = false;
            this.disAgree = false;
            this.agree = false;
          }
        });
    },
    goDetailModal() {}
  }
};
</script>